import React from 'react'
import {Link} from 'react-router'

import './sideNavBar.less'

export default class SideNavBar extends React.Component{
    constructor(props){
        super(props);
        this.state = {
            isShow : false
        }
    }
    show(){
        this.setState({
            isShow:!this.state.isShow
        })
    }
    render(){
        let isShow = this.state.isShow;
        let share = !!this.props.share;
        return(
            <div className="sideNavBar">
                <ul>
                    { share ? <Link  className={`sideNavBar5 ${isShow ? "active" : ""}`}>
                        <li><i className="iconfont icon-share"> </i></li>
                    </Link>:null}
                    <Link to="/" className={`sideNavBar4 ${isShow ? "active" : ""}`}>
                        <li><i className="iconfont icon-shouye-copy"> </i></li>
                    </Link>
                    <Link className={`sideNavBar3 ${isShow ? "active": ""}`}>
                        <li><i className="iconfont icon-tubiao3"> </i></li>
                    </Link>
                    <Link className={`sideNavBar2 ${isShow ? "active" : ""}`}>
                        <li><i className="iconfont icon-tubiao4"> </i></li>
                    </Link>
                    <Link to="/my" className={`sideNavBar1 ${isShow ? "active" : ""}`}>
                        <li><i className="iconfont icon-my"> </i></li>
                    </Link>
                    <Link className={`sideNavBar0 ${isShow ? "active" : ""}`}  onClick={this.show.bind(this)}>
                        <li><i className="iconfont icon-tianjia "> </i></li>
                    </Link>
                </ul>
            </div>
        )
    }
}